window.chartColors = {
    red: 'rgb(255, 99, 132)',
    orange: 'rgb(255, 159, 64)',
    yellow: 'rgb(255, 205, 86)',
    green: 'rgb(75, 192, 192)',
    blue: 'rgb(54, 162, 235)',
    purple: 'rgb(153, 102, 255)',
    grey: 'rgb(201, 203, 207)'
};
var eletime = ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00','06:00', '07:00', '08:00','09:00', '10:00', '11:00', '12:00', '13:00', '14:00','15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00','22:00', '23:00'];
var config = {
    type: 'line',
    data: {
        labels: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00','06:00', '07:00', '08:00','09:00', '10:00', '11:00', '12:00'],
        datasets: [{
            label: '昨日用电',
            backgroundColor: window.chartColors.red,
            borderColor: window.chartColors.red,
            data: [
                10,
                0,
                5,
                3,
                10,
                3,
                5
            ],
            fill: false,
        }, {
            label: '今日用电',
            fill: false,
            backgroundColor: window.chartColors.blue,
            borderColor: window.chartColors.blue,
            data: [
                5,
                30,
                3,
                6,
                8,
                0,
                5
            ],
        }]
    },
    options: {
        responsive: true,
        title: {
            display: true,
            text: '用电曲线图',
            fontSize:18,
            fontWeight:'normal',
        },
        tooltips: {
            mode: 'index',
            intersect: false,
        },
        hover: {
            mode: 'nearest',
            intersect: true
        },
        scales: {
            xAxes: [{
                display: true,
                scaleLabel: {
                    display: true,
                    labelString: 'Time'
                }
            }],
            yAxes: [{
                display: true,
                scaleLabel: {
                    display: true,
                    labelString: 'Value'
                }
            }]
        }
    }
};

window.onload = function() {
    var ctx = document.getElementById('canvas').getContext('2d');
    window.myLine = new Chart(ctx, config);
};
